<template>
	<view class="item" v-for="(item,index) in noticeLists" :key="index" @click="bindNewsDetail(item)">
		<view class="top">
			<text class="title">{{item.title}}</text>
			<text class="time">{{item.createTime}}</text>
		</view>
		<text class="content">
			{{item.content	}}
		</text>
	</view>
	<image src="../../static/empty.png" mode="widthFix" style="width: 348rpx;display: block;margin:400rpx auto;" v-if="emptyState"></image>
	
</template>

<script setup>
	import {
		noticeList
	} from '@/util/api.js'
	import {
		onShow,
		onReachBottom
	} from '@dcloudio/uni-app'
	import {
		ref
	} from 'vue';
	const noticeLists = ref([])
	const emptyState = ref(false)
	const pageDAO = ref({
		"pageNum": 1,
		"pageSize": 10
	})
	onShow(() => {
		getData()
	})
	const getData = async () => {
		const result = await noticeList(pageDAO.value)
		if(pageDAO.value.pageNum==1){
			if(result.data.records.length==0){
				emptyState.value = true
			}else{
				emptyState.value = false
			}
			noticeLists.value = result.data.records
		}else{
			noticeLists.value = noticeLists.value.concat(result.data.records)
		}
		
	}
	onReachBottom(()=>{
		pageDAO.value.pageNum++
		getData()
	})
	const bindNewsDetail = (item)=>{
		uni.setStorageSync('news-info',JSON.stringify(item))
		uni.navigateTo({
			url:'/pages/newsInfo/newsInfo'
		})
	}
</script>

<style lang="scss">
	.item {
		background: #FFFFFF;
		box-shadow: 0px 15rpx 38rpx 2rpx rgba(49, 54, 70, 0.05);
		border-radius: 23rpx;
		margin: 38rpx;
		padding: 38rpx;

		.top {
			display: flex;
			justify-content: space-between;
			align-items: center;

			.title {
				color: #333;
				font-size: 30rpx;
				font-weight: 800;
			}

			.time {
				color: #333;
				font-size: 24rpx;
			}
		}

		.content {
			display: block;
			margin-top: 38rpx;
			color: #999;
			font-size: 24rpx;

		}
	}

	page {
		background: #F6F7F9;
	}
</style>